<!DOCTYPE html>
<html xmlns:th="http://www.w3.org/1999/xhtml">

<head th:replace="common/head::head">
</head>
<body>
<div class="layui-container">
    <form action="./save.json" class="layui-form" id="form_node">
        <div class="layui-form-item">
            <input type="hidden" id="id" name="id" th:value="${item?.id}">
            <input type="hidden" id="type" name="type" th:value="${item}?'edit':'add'">
            <label class="layui-form-label">SSH名称</label>
            <div class="layui-input-block">
                <input type="text" id="name" name="name" th:value="${item?.name}" placeholder="请填写SSH名称"
                       class="layui-input"
                       required
                       lay-verify="required">
            </div>

        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">Hostname</label>
            <div class="layui-input-block">
                <input type="text" id="host" name="host" th:value="${item?.host}"
                       placeholder="请填写节Hostname" class="layui-input"
                       required
                       lay-verify="required">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">Port</label>
            <div class="layui-input-block">
                <input type="number" id="port" name="port" th:value="${item?.port}"
                       placeholder="请填写Port,默认22" class="layui-input"
                       lay-verify="required">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">Username</label>
            <div class="layui-input-block">
                <input type="text" id="user" name="user" th:value="${item?.user}"
                       placeholder="请填写Username" class="layui-input"
                       lay-verify="required">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">Password</label>
            <div class="layui-input-block">
                <input type="password" id="password" name="password" th:value="${item?.password}"
                       placeholder="请填写password或者证书密码" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">认证方式</label>
            <div class="layui-input-block">
                <input th:each="i : ${connectTypes}" type="radio" name="connectType" lay-filter="connectType"
                       th:value="${i}"
                       th:title="${i}"
                       th:checked="${item?.connectType==i}">
            </div>
        </div>
        <div class="layui-form-item" id="privateKey" style="display: none;">
            <label class="layui-form-label">私钥内容</label>
            <div class="layui-input-block">
                <textarea name="privateKey" placeholder="-----BEGIN RSA PRIVATE KEY-----"
                          class="layui-textarea" th:text="${item?.privateKey}"></textarea>
            </div>
        </div>
        <script th:if="${item}" th:inline="javascript" type="text/javascript">
            asyncFn.push(function () {
                if ([[${item?.connectType}]] === 'PUBKEY') {
                    $("#privateKey").show();
                }
            });
        </script>
        <div class="layui-form-item">
            <label class="layui-form-label">编码格式</label>
            <div class="layui-input-block">
                <select name="charset" lay-verify="required" lay-search="">
                    <option value="">请选择编码格式</option>
                    <option th:selected="${(item==null && c.name()=='UTF-8') || (item?.charset==c.name())}"
                            th:value="${c.name()}" th:each="c : ${charsets}"
                            th:text="${c.name()}"></option>
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">文件目录</label>
            <div class="layui-input-block">
                <textarea name="fileDirs" placeholder="授权可以直接访问的目录，多个回车换行即可"
                          class="layui-textarea" th:text="${fileDirs}"></textarea>
            </div>
        </div>
        <div class="layui-form-item" style="padding-left: 20%">
            <button class="layui-btn layui-btn-normal" lay-submit lay-filter="submit">提交
            </button>

            <a th:if="${item}" class="layui-btn layui-btn-warm" th:data-id="${item.id}" id="delete">删除</a>
        </div>
    </form>
</div>
</body>
<script type="text/javascript">


    function loadSuccess() {
        form.on('submit(submit)', function (data) {
            loadingAjax({
                url: data.form.action,
                data: data.field,
                success: function (data) {
                    layer.msg(data.msg);
                    if (200 === data.code) {
                        autoClose();
                    }
                }
            });
            return false;
        });

        $("#delete").click(function () {
            var id = $(this).attr("data-id");
            var msg = '确定删除SSH吗 ？';
            layer.confirm(msg, {
                title: '系统提示'
            }, function (index) {
                loadingAjax({
                    url: './del.json',
                    data: {
                        id: id
                    },
                    success: function (data) {
                        layer.msg(data.msg);
                        if (200 === data.code) {
                            autoClose();
                        }
                    }
                });
            });
        });

        form.on('radio(connectType)', function (data) {
            if (data.value === "PUBKEY") {
                $("#privateKey").show();
            } else {
                $("#privateKey").hide();
            }
        });
    }
</script>
</html>
